<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Pragma" content="no-cache"/>    
<meta http-equiv="Cache-Control" content="no-cache"/>    
<meta http-equiv="Expires" content="0"/>
<title>订单结算</title>
[#include "includes/header.html"/]
<link href="${webctx}/resources/css/jiesuan.css" rel="stylesheet"/>
</head>
<body>
<div class="content">
<!-- 收货地址 begin -->
<div id="topFixedDiv" style="height: 7rem;"> 
	<input type="hidden" value="${receiver.id}" id="select_receiverId">
	<div id="addressDefault" class="weui-cells address_defalut address_border" style="height: 5rem;font-size: 12px;border: none;">
	    [#if receiver??]
	    	<div id="select_addr" class="weui-cell weui-cell_access" style="padding: 0px 15px !important;">
		    	<div class="weui-cell__bd">
	              	<div>收件人:</div>
	              	<strong><span id="sel_name">${receiver.receiverName}</span></strong> 
	              	<span id="sel_phone">${receiver.phone}</span> 
	            </div>
	    		<div class="weui-cell__ft" style="text-align: left;"><span id="sel_address">${fullName}${receiver.address}</span></div>
	    	</div>
		[#else]
			<div id="select_addr" class="weui-cell weui-cell_access" style="border: none;padding: 0px 15px !important;">
	            <div class="weui-cell__ft">
	            	请填写收货地址
	            </div>
	        </div>
		[/#if]
     </div>
</div>
<!-- 收货地址 end-->
<!-- 商品列表begin -->
<div class="order_info">
<ul>
[#list order.orderItems as item]
<a class="weui-cell goods-list" href="${webctx}/product/detail?id=${item.productId}">
<li class="hproduct">
<img class="photo" src="${img_domain}${item.productImg}">
<div class="fn"> ${item.productName}</div>
<!-- <p class="sku_coll">编号：${item.sn} </p> -->
[#if item.specificationValues?? && item.specificationValues?size>0]
<p class="sku_coll">规格： [#list item.specificationValues as spv]${spv.name}/[/#list]</p>
[/#if]
<p class="sku_price">¥${currency(item.price, true)}</p>
<p class="sku_count">×${item.quantity}</p>
</li>
</a>
[/#list]
</ul>
</div>
<!-- 商品列表end -->
<div class="weui-cells" style="font-size: 14px;">
  	<div class="weui-cell">
	  	<div class="weui-cell__bd"><p>商品金额</p></div>
	    <div class="weui-cell__ft"><span style="color: red;">￥${currency(order.totalPrice, true)}</span> [#if order.oldPrice??] <s><span style="font-size: 10px;">${currency(order.oldPrice, true)}</span></s>[/#if]</div>
    </div>
    <div class="weui-cell">
	  	<div class="weui-cell__bd"><p>邮费</p></div>
	    <div class="weui-cell__ft">+ ￥<span id="order_postFee">${currency(order.postFee, true)}</span>[#if order.oldPostFee??] <s><span style="font-size: 10px;">${currency(order.oldPostFee, true)}</span></s>[/#if]</div>
    </div>
    <!-- <div class="weui-cell weui-cell_access">
      	<div class="weui-cell__bd"><p>优惠</p></div>
      	<div class="weui-cell__ft">使用优惠码</div>
    </div> -->
    <div class="weui-cells__title">买家留言</div>
  	<div class="weui-cell">
	    <div class="weui-cell__bd weui-cell-primary">
	      <textarea id="order_memo" class="weui-textarea" placeholder="请输入留言" rows="2"></textarea>
	    </div>
  	</div>
</div>

<div class="weui-cells weui-cells_form" style="font-size: 14px;">
    <div class="weui-cell weui-cell_switch">
        <div class="weui-cell__bd">是否需要发票</div>
        <div class="weui-cell__ft">
          <label for="isInvoice" class="weui-switch-cp">
            <input id="isInvoice" name="need_invoice" class="weui-switch-cp__input" type="checkbox">
            <div class="weui-switch-cp__box"></div>
          </label>
        </div>
      </div>
    </div>
    <!-- <div class="weui-cells__title">发票抬头</div> -->
    <div class="weui-cells weui-cells_form" style="display: none;" id="invoice_head">
      <div class="weui-cell">
        <div class="weui-cell__bd">
          <textarea id="invoice_title" class="weui-textarea" placeholder="请输入发票抬头" rows="2"></textarea>
          <div class="weui-textarea-counter"><span>0</span>/100</div>
        </div>
    </div>
</div>

<div class="weui-tabbar toolbar-bottom">
	<div class="mini-btn-2-1">
		<div style="padding-left: 1rem;padding-top: 1.5rem;"><span>合计:</span><span class="price" id="total_price">${currency(order.payFee, true)}</span></div>
	</div>
	<div class="big-btn-2-1">
		<a id="create_order_btn" href="javascript:void(0);" class="big-btn red-btn" style="height: 5rem;color: white;">提交订单</a>
	</div>
</div>
<!-- 支付 -->
</div>
<div id="half" class="weui-popup__container popup-bottom" style="z-index: 1000;">
      <div class="weui-popup__overlay"></div>
      <div class="weui-popup__modal">
        <div class="toolbar">
          <div class="toolbar-inner">
            <a href="javascript:void(0);" class="picker-button close-popup">关闭</a>
          </div>
        </div>
        <div id="address_div" class="modal-content" style="height: 420px;"></div>
      </div>
</div>
<div id="add_half_dialog" class="weui-popup__container popup-bottom" style="z-index: 1000;">
      <div class="weui-popup__overlay"></div>
      <div class="weui-popup__modal">
        <div class="toolbar">
          <div class="toolbar-inner">
            <a href="javascript:void(0);" class="picker-button close-popup">关闭</a>
          </div>
        </div>
        <div id="address_add_div" class="modal-content"></div>
      </div>
</div>
<!--手机端script需要加载后方-->
[#include "includes/footer.html"/]
<script type="text/javascript">
var items = ${items};
$(document).ready(function(){
	$("[name = need_invoice]:checkbox").click(function(){
		if($(this).is(":checked") == true){
			$("#invoice_head").show();
		}else{
			$("#invoice_head").hide();
		}
	});
	
	var allowSubmit = true;
	var orderId = null;
	
	$("#select_addr").click(function(){
		$.showLoading("正在加载...");
		$("#address_div").load("${webctx}/receiver", function(){
			$.hideLoading();
			$("#half").popup();
		});
	});
	
	$("#create_order_btn").click(function(){
		if(items == null || items == ""){
			showMsg("没有订单可以提交");
			return;
		}
		if($("#select_receiverId").val()==null || ""==$("#select_receiverId").val()){
			$.toast("请选择收货地址", "text");
			return;
		}
		var totalPrice = $("#total_price").text();
		if(totalPrice<=0){
			$.toast("订单金额必须大于0", "text");
			return;
		}
		if($("[name = need_invoice]:checkbox").is(':checked')) {
			if($("#invoice_title").val() == null || $("#invoice_title").val()==""){
				$.toast("请填写发票抬头", "text");
				return;
			}
		}
		if(allowSubmit == false) {
			showPay(orderId);
			return;
		}
		$.showLoading("提交中...");
		$.post("${webctx}/order/create", {receiverId:$("#select_receiverId").val(), 
			invoiceTitle:$("#invoice_title").val(),
			memo : $("#order_memo").val(), items : JSON.stringify(items)}, function(data){
			$.hideLoading();
			allowSubmit = false;
			var resp = data;
			if(resp.code != 200){
				$.alert(resp.msg==null ? "系统错误" : resp.msg);
				return;
			}
			//显示选择支付方式弹出框
			orderId = resp.data;
			showPay(resp.data);
		}); 
	});
	
	function showPay(orderid){
		$.actions({
			actions: [{
			    text: "微信安全支付",
			    className: "color-primary",
			    onClick: function() {
			    	//do something
			      	$.post("${webctx}/pay", {orderId:orderid}, function(data){
			      		var resp = data;
						if(resp.code != 200){
							$.alert(resp.msg==null ? "系统错误" : resp.msg);
							return;
						}
					});
			    }
			}]
		});
	}
	
});
</script>
</body>
</html>
